import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
    //不能在state里面进行修改属性值  因为后期维护的时候查找麻烦
    state: {
        count: 0
    },
    //mutation 专门处理修改state 属性值  不能在里面使用异步函数
    mutations: {
        add(state) {
            state.count++
        },
        addN(state, step) {
            state.count += step
        },
        sub(state) {
            state.count--
        },
        subN(state, step) {
            state.count -= step
        }
    },
    //专门处理异步函数  但是不能够修改值  必须在mutations里面修改  context类似与vuex实例
    actions: {
        addAsync(context) {
            setTimeout(() => {
                //通过context.conmmit() 触发某个 mutation 修改state
                context.commit('add')
            }, 1000)
        },
        addNAsync(context, step) {
            setTimeout(() => {
                context.commit('addN', step)
            })
        },
        subAsync(context) {
            setTimeout(() => {
                context.commit('sub')
            })
        },
        subNAsync(context, step) {
            setTimeout(() => {
                context.commit('subN', step)
            })
        }
    },
    modules: {}
})